import React from "react";
import { Link } from "react-router-dom";

function List(props) {
  let { list } = props;

  return (
    <div>
      <div className="target mt-10 bg-fff">
        <h3 className="h40 flex aic pl-8">目的地推荐</h3>
        <ul className="list">
          {list.map((item) => (
            <Link key={item.id} className="item" to={"/target/"+item.id}>
              <div className="img-box rel">
                <img
                  className="w100pc"
                  src={item.imageUrl}
                  alt=""
                />
                <span className="h40 fcc price fff abs">¥3288</span>
              </div>
              <div className="desc f14 pb-10">
                <h3 className="mt-10 f12">{item.name}</h3>
                <p className="mt-10 f10 lh15">
                  浪漫美景+免费WIFI、电视、齐全设备=完美假期。
                </p>
                <p className="city fcc mt-5 f10">深圳●大鹏新区</p>
              </div>
            </Link>
          ))}
        </ul>
      </div>
    </div>
  );
}

export default List;
